<!--
 * @Description: 
 * @Version: 2.0
 * @Autor: jerry.zzy
 * @Date: 2020-11-03 09:36:52
 * @LastEditors: jerry.zzy
 * @LastEditTime: 2021-10-25 16:50:33
-->
//↘↘↘↘↘↘↘↘↘↘↘↘↘↘↘↘↘↘↘注释↙↙↙↙↙↙↙↙↙↙↙↙↙↙↙↙
和库存组织档案不是一个表，仓库和管理员是多对多的关系，
（1）新增按钮，新增和修改弹窗里面的表单是存货编码、存货名称、工号、姓名、性别、联系方式，其中姓名、性别、联系方式都是根据工号生成。
（2）操作增加删除功能、删除这一条记录。


12.13修改信息时，点击修改，走 仓库管理员信息管理-按照ID查找 这个接口获取的信息进行渲染，不直接从列表里获取的信息进行渲染
//↗↗↗↗↗↗↗↗↗↗↗↗↗↗↗↗↗↗↗↗↖↖↖↖↖↖↖↖↖↖↖↖↖↖↖↖↖
<template>
  <a-card>
    <a-form-model :model="formdata" v-bind="layout">
      <a-row>
        <!-- 搜索栏 -->
        <a-col :lg="6" :md="6" :sm="24">
          <a-form-model-item label="仓库编码">
            <a-select
              v-model="formdata.inventoryNo"
              @change="DepotNameChange"
              showSearch
            >
              <a-select-option
                v-for="item in WarehouseCodeList"
                :key="item.id"
                :value="
                  item.inventoryNo + '|' + item.inventoryName + '|' + item.id
                "
                >{{ item.inventoryNo }}
                {{ item.inventoryName }}</a-select-option
              >
            </a-select>
          </a-form-model-item>
        </a-col>

        <a-col :lg="6" :md="6" :sm="24">
          <a-form-model-item label="仓库名称">
            <a-input disabled v-model="formdata.inventoryName"></a-input>
          </a-form-model-item>
        </a-col>

        <a-col :lg="6" :md="6" :sm="24">
          <a-form-model-item label="姓名">
            <a-select
              placeholder=""
              v-model="formdata.xingming"
              @change="changeName"
              showSearch
            >
              <a-select-option
                v-for="item in UserList"
                :key="item.userId"
                :value="item.userId + '|' + item.userName + '|' + item.workNo"
                >{{ item.workNo }} {{ item.userName }}</a-select-option
              >
            </a-select>
          </a-form-model-item>
        </a-col>

        <a-col :lg="6" :md="6" :sm="24"> </a-col>
        <a-col :lg="6" :md="6" :sm="24" align="right">
          <a-button type="primary" @click="getsearch"> 查询 </a-button>
          <a-button :style="{ marginLeft: '8px' }" @click="handleReset">
            重置
          </a-button>
        </a-col>
      </a-row>

      <a-row>
        <a-button
          type="primary"
          @click="showModalXinZeng"
          style="margin-bottom: 10px"
        >
          <a-icon type="plus" />
          添加管理员信息
        </a-button>
        <!-- <a-button type="primary" style="margin-left: 8px">导入</a-button> -->
        <a-button
          style="margin-left: 8px; margin-right: 60px"
          @click="exportToExcel"
          >导出</a-button
        >

        <!-- 彈窗开始 -->
        <a-modal
          :visible="visibleXinZeng"
          width="50%"
          title="添加管理员信息"
          okText="确定"
          @cancel="handleCancel2"
          @ok="handleOk2"
        >
          <a-form-model
            ref="ruleForm"
            :rules="rules"
            :model="xinzeng_formdata"
            v-bind="layout"
          >
            <a-row>
              <a-col :md="10" :sm="24">
                <a-form-model-item label="仓库编码">
                  <a-select
                    v-model="xinzeng_formdata.inventoryNo"
                    @change="DepotNameChange_Add"
                    showSearch
                  >
                    <a-select-option
                      v-for="item in WarehouseCodeList"
                      :key="item.id"
                      :value="item.inventoryNo + '|' + item.inventoryName"
                      >{{ item.inventoryNo }}
                      {{ item.inventoryName }}</a-select-option
                    >
                  </a-select>
                </a-form-model-item>
              </a-col>

              <a-col :md="10" :sm="24">
                <a-form-model-item label="仓库名称">
                  <a-input
                    disabled
                    v-model="xinzeng_formdata.inventoryName"
                  ></a-input>
                </a-form-model-item>
              </a-col>

              <a-col :md="10" :sm="24">
                <a-form-model-item ref="gonghao" label="工号" prop="gonghao">
                  <a-select
                    placeholder=""
                    v-model="xinzeng_formdata.gonghao"
                    @change="UserNameChange"
                  >
                    <a-select-option
                      v-for="val in UserList"
                      :key="val.userId"
                      :value="
                        val.workNo + '|' + val.userName + '|' + val.userId
                      "
                      >{{ val.workNo }} {{ val.userName }}</a-select-option
                    >
                  </a-select>
                </a-form-model-item>
              </a-col>
              <a-col :md="10" :sm="24">
                <a-form-model-item ref="xingming" label="姓名" prop="xingming">
                  <a-input v-model="xinzeng_formdata.xingming" disabled />
                </a-form-model-item>
              </a-col>
            </a-row>
          </a-form-model>
        </a-modal>
        <!-- 新增弹窗结束 -->
      </a-row>
    </a-form-model>

    <!-- 表格 -->
    <a-table
      bordered
      :data-source="dataSource"
      :columns="columns"
      :pagination="pagination"
      @change="handleTableChange"
      id="myTable"
    >
      <template slot="序号" slot-scope="text, record">
        <editable-cell
          :text="text"
          @change="onCellChange(record.key, 'xuhao', $event)"
        />
      </template>
      <template slot="caozuo" slot-scope="text, record">
        <!-- 修改按钮与修改页面 -->
        <span slot="caozuo">
          <a type="primary" @click="showModal1(record)"> 修改 </a>&nbsp;
        </span>
        <!-- 删除提示 -->
        <a-popconfirm
          v-if="dataSource.length"
          title="是否确认删除?"
          @confirm="onDelete(record.id)"
        >
          <a href="javascript:;">删除</a>
        </a-popconfirm>
      </template>
    </a-table>
    <!-- 修改弹窗开始 -->
    <a-modal
      title="修改"
      :visible="visible1"
      width="50%"
      @ok="handleOk1"
      @cancel="handleCancel1"
      cancelText="取消"
      okText="保存"
    >
      <a-form-model
        ref="ruleForm"
        :model="xiugai_formdata"
        :rules="rules"
        v-bind="layout"
      >
        <a-row>
          <a-col :md="10" :sm="24">
            <a-form-model-item
              ref="inventoryNo"
              label="仓库编码"
              prop="inventoryNo"
            >
              <a-select
                v-model="xiugai_formdata.inventoryNo"
                @change="DepotNameChange_Add2"
                showSearch
              >
                <a-select-option
                  v-for="item in WarehouseCodeList"
                  :key="item.id"
                  :value="
                    item.inventoryNo + '|' + item.inventoryName + '|' + item.id
                  "
                  >{{ item.inventoryNo }}
                  {{ item.inventoryName }}</a-select-option
                >
              </a-select>
            </a-form-model-item>
          </a-col>

          <a-col :md="10" :sm="24">
            <a-form-model-item
              ref="inventoryName"
              label="仓库名称"
              prop="inventoryName"
            >
              <a-input
                disabled
                v-model="xiugai_formdata.inventoryName"
              ></a-input>
            </a-form-model-item>
          </a-col>

          <a-col :md="10" :sm="24">
            <a-form-model-item ref="gonghao" label="工号" prop="gonghao">
              <a-select
                placeholder=""
                v-model="xiugai_formdata.workNo"
                @change="UserNameChange2"
              >
                <a-select-option
                  v-for="val in UserList"
                  :key="val.userId"
                  :value="val.workNo + '|' + val.userName + '|' + val.userId"
                  >{{ val.workNo }} {{ val.userName }}</a-select-option
                >
              </a-select>
            </a-form-model-item>
          </a-col>
          <a-col :md="10" :sm="24">
            <a-form-model-item ref="username" label="姓名" prop="username">
              <a-input v-model="xiugai_formdata.username" disabled />
            </a-form-model-item>
          </a-col>
          <!-- 
          <a-col :md="10" :sm="24">
            <a-form-model-item ref="xingbie" label="性别" prop="xingbie">
              <a-input v-model="xiugai_formdata.sex_dictText" disabled />
            </a-form-model-item>
          </a-col>

          <a-col :md="10" :sm="24">
            <a-form-model-item
              ref="lianxifangshi"
              label="联系方式"
              prop="lianxifangshi"
            >
              <a-input v-model="xiugai_formdata.phone" disabled />
            </a-form-model-item>
          </a-col> -->
        </a-row>
      </a-form-model>
    </a-modal>
    <!-- 修改弹窗结束 -->
  </a-card>
</template>
 
<script>
import FileSaver from "file-saver";
import XLSX from "xlsx";

import { CangKuGuanLiYuanHttp } from "../../services/modules/JiChuXinXiGuanLi/CangKuGuanLiYuanXinXiGuanLi";
const $http = new CangKuGuanLiYuanHttp();
import { sheet2blob } from "@/utils/export.js";

export default {
  data() {
    return {
      queryParam: {
        //查询参数
        page: 1, //第几页
        size: 10, //每页中显示数据的条数
        hosName: "",
        hosCode: "",
        province: "",
        city: "",
      },
      //===============分页========================
      pagination: {
        total: 0,
        current: 1,
        pageSize: 10, //每页中显示10条数据
        pageSizeOptions: ["10"], //每页中显示的数据
        showTotal: (total) => `共有${total}条数据`, //分页中显示总的数据
      },
      //修改弹窗
      visible1: false,
      //新增弹窗
      visibleXinZeng: false,
      xiugai_formdata: {
        godownKeeperId: "", //修改时 要传这个id
        organizationGodownKeeperId: "", //修改时 要传这个id
        id: "", //修改时 要传这个id
        inventoryOrganizationFileId: "", //kucunid
        userId: "",
        inventoryNo: "", //depotNo
        inventoryName: "", //depotName
        workNo: "", //gonghao
        username: "", //xingming
        sex_dictText: "", //xingbie
        phone: "", //lianxifangshi
      },
      xinzeng_formdata: {
        userId: "",
        inventoryNo: "", //depotNo
        inventoryName: "", //depotName
        gonghao: "", //gonghao
        xingming: "", //xingming
        xingbie: "", //xingbie
        lianxifangshi: "", //lianxifangshi
        id: "",
      },

      formdata: {
        //增加数据
        id: "", //仓库编码id
        inventoryNo: "", //编码
        inventoryName: "", //名称
        xingming: "", //姓名
      },
      UserList: [],
      cangkuname: [],
      WarehouseCodeList: [],

      // 增加栏的格式
      layout: {
        labelCol: { span: 8 },
        wrapperCol: { span: 15 },
      },

      // 导出专用
      maxSize: "",

      // 表格数据
      dataSource: [
        {
          key: "1",
          xuhao: "1",
          name: "010101",
          sex_dictText: "七和生物",
          gonghao: "99999",
          xingming: "jerry",
          xingbie: "男",
          lianxifangshi: "16678610000",
        },
      ],
      count: 2,
      columns: [
        {
          title: "序号",
          dataIndex: "xuhao",
          align: "center",
          scopedSlots: { customRender: "xuhao" },
        },
        {
          title: "仓库编码",
          dataIndex: "inventoryNo",
          align: "center",
        },
        {
          title: "仓库名称",
          dataIndex: "inventoryName",
          align: "center",
        },
        {
          title: "工号",
          dataIndex: "workNo",
          align: "center",
        },
        {
          title: "姓名",
          dataIndex: "username",
          align: "center",
        },
        {
          title: "性别",
          dataIndex: "sex_dictText",
          align: "center",
        },
        {
          title: "联系方式",
          dataIndex: "phone",
          align: "center",
        },

        {
          title: "操作",
          dataIndex: "caozuo",
          scopedSlots: { customRender: "caozuo" },
          align: "center",
        },
      ],
      // 新增验证规则
      rules: {
        // name: [{ required: true, message: "姓名为必填项!", trigger: "blur" }],
        // sex: [{ required: true, message: "性别为必填项！", trigger: "blur" }],
      },
    };
  },
  mounted() {
    // this.getChengBaoHu();
    this.getAllNumberName1(); //返回所有的仓库编码、仓库名称
    this.GetWarehouseManagerList(); //仓库管理员信息管理-列表
    this.getUserByRoleName(); //根据角色名来查询用户名
  },

  methods: {
    changeName(value) {
      let array = value.split("|");
      this.formdata.userId = array[2];
      this.formdata.userName = array[1];
      this.formdata.workNo = array[0];
    },
    //搜索开始
    getsearch() {
      let dd = (this.pagination.page = 1); //分页
      (this.dataSource = []),
        $http
          .GetWarehouseManagerList(
            "?pageNo=" +
              dd +
              "&inventoryOrganizationFileId=" +
              this.formdata.id +
              "&userId=" +
              this.formdata.workNo
          )
          .then((res) => {
            const pagination = { ...this.pagination }; //分页
            this.data = res.result.records;
            pagination.total = res.result.total; //分页
            pagination.pageSize = res.result.size; //分页
            this.pagination = pagination; //分页
            console.log(this.data, "我是用户列表的信息");
            for (let i = 0; i < res.result.records.length; i++) {
              let data = {
                id: res.result.records[i].id,
                key: res.result.records[i].id,
                xuhao: (res.result.current - 1) * 10 + i + 1,

                workNo: res.result.records[i].workNo,
                username: res.result.records[i].username,

                inventoryNo: res.result.records[i].inventoryNo,
                inventoryName: res.result.records[i].inventoryName,
                inventoryOrganizationFileId:
                  res.result.records[i].inventoryOrganizationFileId, //库存组织档案id
                sex_dictText: res.result.records[i].sex_dictText,
                phone: res.result.records[i].phone,
              };
              console.log("要获取的数据", data);
              this.dataSource.push(data);
            }
          });
    },
    // 仓库管理员信息管理-列表
    GetWarehouseManagerList() {
      let dd = this.queryParam.page; //分页
      (this.dataSource = []),
        $http.GetWarehouseManagerList("?pageNo=" + dd).then((res) => {
          const pagination = { ...this.pagination }; //分页
          this.data = res.result.records;
          pagination.total = res.result.total; //分页
          pagination.pageSize = res.result.size; //分页
          this.pagination = pagination; //分页
          this.maxSize = res.result.total;
          console.log("res----->", res);
          for (let i = 0; i < res.result.records.length; i++) {
            let data = {
              id: res.result.records[i].id,
              key: res.result.records[i].id,
              xuhao: (res.result.current - 1) * 10 + i + 1,
              inventoryNo: res.result.records[i].inventoryNo,
              inventoryName: res.result.records[i].inventoryName,
              workNo: res.result.records[i].workNo,
              username: res.result.records[i].username,

              inventoryOrganizationFileId:
                res.result.records[i].inventoryOrganizationFileId, //库存组织档案id
              sex_dictText: res.result.records[i].sex_dictText,
              phone: res.result.records[i].phone,
              userId: res.result.records[i].userId,
            };
            console.log("要获取的数据", data);
            this.dataSource.push(data);
          }
        });
    },

    //  下拉框触发事件
    UserNameChange(value, option) {
      console.log(value, option);
      let array = value.split("|");
      console.log("array", array);
      this.xinzeng_formdata.userId = array[2];
      this.xinzeng_formdata.gonghao = array[0];
      this.xinzeng_formdata.xingming = array[1];
    },
    //  下拉框触发事件
    UserNameChange2(value, option) {
      console.log(value, option);
      let array = value.split("|");
      console.log("array", array);
      this.xiugai_formdata.userId = array[2];
      this.xiugai_formdata.workNo = array[0];
      this.xiugai_formdata.username = array[1];
    },
    //根据角色 查询仓库管理员
    getUserByRoleName() {
      let dd = "仓库管理员";
      $http.getUserByRoleName("?roleName=" + dd).then((res) => {
        console.log("res", res);
        for (let i = 0; i < res.result.length; i++) {
          let data = {
            userName: res.result[i].userName,
            userId: res.result[i].userId,
            workNo: res.result[i].workNo,
          };
          this.UserList.push(data);
        }
      });
    },

    handleCancel1() {
      // 修改弹窗取消
      this.visible1 = false;
    },
    handleReset() {
      this.ResetTab();
      //重置
      this.formdata = {
        id: "",
        inventoryNo: "", //depotNo
        inventoryName: "", //depotName
        xingming: "", //xingming
      };
      this.pagination = {
        total: 0,
        current: 1,
        pageSize: 10, //每页中显示10条数据
        pageSizeOptions: ["10"], //每页中显示的数据
        showTotal: (total) => `共有${total}条数据`, //分页中显示总的数据
      };

      this.GetWarehouseManagerList();
    },
    ResetTab() {
      //查询参数
      this.queryParam = {
        page: 1, //第几页
        size: 10, //每页中显示数据的条数
        hosName: "",
        hosCode: "",
        province: "",
        city: "",
      };
    },

    CHONGZHILIEBIAO() {
      let dd = 1;
      (this.dataSource = []),
        $http.GetWarehouseManagerList("?pageNo=" + dd).then((res) => {
          const pagination = { ...this.pagination }; //分页
          this.data = res.result.records;
          pagination.total = res.result.total; //分页
          pagination.pageSize = res.result.size; //分页
          this.pagination = pagination; //分页

          this.dataSource = res.result.records;
          let wowo = res.result.records;
          for (let i = 0; i < wowo.length; i++) {
            this.dataSource[i].xuhao = (res.result.current - 1) * 10 + i + 1;
          }
        });
    },

    //修改按钮
    showModal1(record) {
      console.log(record, "record");
      $http.GetWarehouseManagerIDList("?id=" + record.id).then((res) => {
        console.log("仓库管理员信息管理-按照ID查找", res);
        this.xiugai_formdata = res.result;

        this.xiugai_formdata.inventoryOrganizationFileId =
          record.inventoryOrganizationFileId;
        this.xiugai_formdata.inventoryNo = this.$set(
          this.xiugai_formdata,
          "inventoryNo",
          res.result.inventoryNo
        );
        this.xiugai_formdata.inventoryName = this.$set(
          this.xiugai_formdata,
          "inventoryName",
          res.result.inventoryName
        );
      });

      this.visible1 = !this.visible1;
      // this.xiugai_formdata.godownKeeperId = record.id; //仓库编码
      // this.xiugai_formdata.inventoryOrganizationFileId =
      //   record.inventoryOrganizationFileId; //仓库编码
      // this.xiugai_formdata.depotNo = record.depotNo; //仓库编码
      // this.xiugai_formdata.depotName = record.depotName; //仓库名称
      // this.xiugai_formdata.workNo = record.workNo;
      // this.xiugai_formdata.username = record.username;

      // this.xiugai_formdata.sex_dictText = record.sex_dictText; //性别
      // this.xiugai_formdata.phone = record.phone; //联系方式
      // this.xiugai_formdata.id = record.id;
      // this.xiugai_formdata.userId = record.userId;
    },
    handleOk1() {
      //修改弹窗ok
      this.visible1 = false;
      const data = {
        userId: this.xiugai_formdata.userId,
        inventoryOrganizationId:
          this.xiugai_formdata.inventoryOrganizationFileId,
        id: this.xiugai_formdata.id,
        organizationGodownKeeperId:
          this.xiugai_formdata.organizationGodownKeeperId,
        godownKeeperId: this.xiugai_formdata.id,
      };
      console.log("data::::::::::", data);
      $http.UpdateWarehouseManager(data).then((res) => {
        if (res.success) {
          this.$message.success("保存成功！");
          this.GetWarehouseManagerList();
          this.xiugai_formdata = {};
          console.log(res);
        } else {
          this.$message.success("保存失败！");
        }
      });
    },
    handleOk2() {
      // 点击增加按钮
      // this.$refs.ruleForm.validate((valid) => {
      // if (valid) {
      this.visibleXinZeng = false;
      const data = {
        inventoryOrganizationId: this.xinzeng_formdata.id,
        userId: this.xinzeng_formdata.userId,
      };
      $http.SaveWarehouseManager(data).then((res) => {
        if (res.success) {
          //清空表单
          (this.xinzeng_formdata = {
            userId: "",
            inventoryNo: "", //depotNo
            inventoryName: "", //depotName
            gonghao: "", //gonghao
            xingming: "", //xingming
            xingbie: "", //xingbie
            lianxifangshi: "", //lianxifangshi
            id: "",
          }),
            this.$message.success("保存成功！");
          this.GetWarehouseManagerList();
          console.log(res);
        } else {
          this.$message.success("保存失败！");
        }
      });
      // } else {
      //   // return false;
      //   console.log("false出现了");
      // }
      // });
    },
    // 确定删除吗？的触发函数
    onDelete(_id) {
      const deletePath = `?id=${_id}`;
      $http
        .DeleteWarehouseManagerList(deletePath)
        .then((res) => {
          if (res && res.code === 200) {
            this.$message.success("删除成功");
            this.GetWarehouseManagerList();
          } else {
            this.$message.error("删除失败");
          }
        })
        .then(() => {
          this.data = [];
        });
    },

    //返回所有的仓库编码、仓库名称
    getAllNumberName1() {
      $http.getAllNumberName1().then((res) => {
        for (let i = 0; i < res.result.length; i++) {
          let data = {
            inventoryNo: res.result[i].storcode,
            inventoryName: res.result[i].storname,
            id: res.result[i].pkStordoc,
          };
          this.WarehouseCodeList.push(data);
          console.log("返回所有的仓库编码、仓库名称", this.WarehouseCodeList);
        }
      });
    },

    // 选择仓库编码的change触发函数
    DepotNameChange(value, option) {
      this.formdata.id = option.key;
      // console.log(value , option);
      const newValue = value.split("|");
      console.log(newValue);
      this.formdata.inventoryNo = newValue[0];
      this.formdata.inventoryName = newValue[1];
    },
    // 选择仓库编码的change触发函数---新增弹窗
    DepotNameChange_Add(value, option) {
      console.log("option", option);
      this.xinzeng_formdata.id = option.key;
      // console.log(value , option);
      let newValue = value.split("|");
      this.xinzeng_formdata.inventoryNo = newValue[0];
      this.xinzeng_formdata.inventoryName = newValue[1];
      console.log(this.xinzeng_formdata.id, "this.xinzeng_formdata.id");
    },
    // 选择仓库编码的change触发函数---Xiugai弹窗
    DepotNameChange_Add2(value, option) {
      console.log(value);
      console.log(option);
      this.xiugai_formdata.inventoryOrganizationFileId = option.key;
      let newValue = value.split("|");
      this.xiugai_formdata.inventoryNo = newValue[0];
      this.xiugai_formdata.inventoryName = newValue[1];
      this.xiugai_formdata.inventoryOrganizationFileId = newValue[2];
    },
    //新增弹窗
    showModalXinZeng() {
      this.visibleXinZeng = true;
    },
    handleCancel2() {
      //新增弹窗
      this.visibleXinZeng = !this.visibleXinZeng;
    },

    // ==============分页======================
    handleTableChange(pagination) {
      this.pagination.current = pagination.current;
      this.pagination.pageSize = pagination.pageSize;
      this.queryParam.page = pagination.current;
      this.queryParam.size = pagination.pageSize;
      this.GetWarehouseManagerList();
    },

    // 导出
    // exportToExcel() {
    //   let et = XLSX.utils.table_to_book(document.querySelector("#myTable")); //此处传入table的DOM节点
    //   console.log(11, et);
    //   let etout = XLSX.write(et, {
    //     bookType: "xlsx",
    //     bookSST: true,
    //     type: "array",
    //   });
    //   try {
    //     FileSaver.saveAs(
    //       new Blob([etout], {
    //         type: "application/octet-stream",
    //       }),
    //       "库存组织档案.xlsx"
    //     ); //trade-publish.xlsx 为导出的文件名
    //   } catch (e) {
    //     console.log(e, etout);
    //   }
    //   return etout;
    // },
    exportToExcel() {
      $http
        .GetWarehouseManagerList(
          "?pageNo=1&pageSize=" +
            this.maxSize +
            "&inventoryOrganizationFileId=" +
            this.formdata.id +
            "&userId=" +
            this.formdata.xingming
        )
        .then((res) => {
          console.log("导入的数据", res.result.records);
          let array = res.result.records;
          this.exportBasic(array);
        });
    },

    // 接收数组，进行导出
    exportBasic(Array) {
      console.log("要导出的数据为:::::", Array);
      // 规整要导出的数据:::::
      let array = [];
      for (let i = 0; i < Array.length; i++) {
        let data = {
          序号: i + 1,
          仓库编码: Array[i].inventoryNo,
          仓库名称: Array[i].inventoryName,
          工号: Array[i].workNo,
          姓名: Array[i].username,
          性别: Array[i].sex_dictText,
          联系方式: Array[i].phone,
        };
        array.push(data);
      }
      // 生成 sheet 表格 数据
      let sheet = XLSX.utils.json_to_sheet(array, {
        // 对导出内容进行相应的排序,手动排序。
        header: [
          "序号",
          "仓库编码",
          "仓库名称",
          "工号",
          "姓名",
          "性别",
          "联系方式",
        ],
      });
      // 生成导出表格
      let blob = sheet2blob(sheet);
      try {
        FileSaver.saveAs(
          new Blob([blob], {
            type: "application/octet-stream",
          }),
          "仓库管理员信息档案.xlsx" // 导出文件夹名称
        );
      } catch (e) {
        console.log(e);
      }
    },
  },
};
</script>